<%@ page language="java" contentType="text/html; charset=UTF-8" import="cn.com.longfuinfo.wx.common.OrderCode" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
			<!-- amazeui -->
		<link rel="stylesheet" type="text/css" href="${BASE_PATH}/static/ui/css/amazeui.min.css" />
		<!-- lib -->
		<link rel="stylesheet" type="text/css" href="${BASE_PATH}/static/lib/swiper/css/swiper.min.css" />
		<!-- app -->
		<link rel="stylesheet" type="text/css" href="${BASE_PATH}/static/app/css/ui.css" />
		<link rel="stylesheet" type="text/css" href="${BASE_PATH}/static/app/css/footer.css"/>
		<link rel="stylesheet" type="text/css" href="${BASE_PATH}/static/app/css/header.css"/>
		<link rel="stylesheet" type="text/css" href="${BASE_PATH}/static/app/css/allorder.css"/>
		<link rel="stylesheet" href="${BASE_PATH}/static/lib/myAlert/myAlert.css" />
		<title>我的订单</title>
		<style type="text/css">
			 body {font:14px / 1.5 "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;-webkit-text-size-adjust:none; -webkit-user-select: none; }
			a{
			  text-decoration: none;
			  color: black;
			}
			ul,li{margin:0;padding:0}
			ul,li{-webkit-tap-highlight-color:rgba(0,0,0,0)}
			li,ul{list-style-type:none;}
			i{font-style:normal; font-weight:normal}
			.dingdan{
				background: url(${BASE_PATH}/static/app/img/201805021845-4.png) no-repeat;
                background-size: cover;
			}
			.shouye{
				background: url(${BASE_PATH}/static/app/img/201805021845.png) no-repeat;
                  background-size: cover;
			}
			.logo_text{
				height: 40px;
				line-height: 40px;
				display: inline-block;
				color: #595b60;
				font-size: 14px;
				margin-left: 6px;
				float: left;
			}
			[class*=am-u-] {
			    border-bottom: 1px solid #fafafa;float: left;
			   }
			   .aaa{
			   		color: #e0e0e1;
			   }
			  .btnn:link {color: #ffffff;} 
			 .btnn:visited {color: #ffffff;}  
			 .btnn:hover{color: #ffffff;} 
			 .btnn:active{color: #ffffff;} 
	</style>
	</head>
	<body>
		  <header>
				<div class="header" >
					<a href="${BASE_PATH}/index"><span class="back"></span></a>
					<a href="${BASE_PATH}/index"><span class="logo_pic"></span></a>
					<span class="logo_text">OK 妈咪</span>
				</div>
			
			<div class="sliding">
				<ul>
					<li id="1">
						<a class="text <c:if test="${state==1}">on</c:if>" href="${BASE_PATH}/order/list?state=1">全部</a>
						<span></span>
					</li>
					<li id="noPay">
						<a class="text <c:if test="${state==2}">on</c:if>" href="${BASE_PATH}/order/list?state=2">待付款</a>
						<span class="dian" style="display:none;"></span>
					</li>
					<li id="noTake">
						<a class="text <c:if test="${state==3}">on</c:if>" href="${BASE_PATH}/order/list?state=3">未使用</a>
						<span class="dian" style="display:none;"></span>
					</li>
					<li id="noEval">
						<a class="text <c:if test="${state==4}">on</c:if>" href="${BASE_PATH}/order/list?state=4">已兑换</a>
						<span class="dian" style="display:none;"></span>
					</li>
					<li id="noDel">
						<a class="text <c:if test="${state==5}">on</c:if>" href="${BASE_PATH}/order/list?state=5">已过期</a>
						<span class="dian" style="display:none;"></span>
					</li>
				</ul>
			</div>
			</header>
				<div class="container  am-g app-goods-list" id="orderList"></div>
				<div data-am-widget="gotop" class="am-gotop am-gotop-fixed" >
					<a href="#top"><span class="am-gotop-title">回到顶部</span><i class="am-gotop-icon am-icon-chevron-up"></i></a>
				</div>
			
		<footer>
			<ul>
				<a href="${BASE_PATH}/index"><li><i class="shouye"></i>首页</li></a>
				<%-- <a href="${BASE_PATH}/goods/fenlei"><li><i class="fenlei"></i>分类</li></a>
				<a href="${BASE_PATH}/goods/youxuan"><li><i class="youxuan"></i>妈咪优选</li></a> --%>
				<a href="${BASE_PATH}/goods/momsay"><li><i class="fenlei"></i>辣妈说</li></a>
				<a href=" https://h5.youzan.com/v2/showcase/homepage?alias=1fo6ae813&sf=wx_menu"><li><i class="youxuan"></i>商城</li></a>
				<a href="${BASE_PATH}/order/list"><li class="text_on"><i class="dingdan"></i>订单</li></a>
				<a href="${BASE_PATH}/my"><li><i class="my"></i>我的</li></a>
			</ul>
		</footer>
		<!-- lib -->
		<script type="text/javascript" src="${BASE_PATH}/static/lib/jquery/jquery-1.11.2.min.js"></script>
		<!-- amazeui -->
		<script type="text/javascript" src="${BASE_PATH}/static/ui/js/amazeui.min.js"></script>
		<!-- lib -->
		<script type="text/javascript" src="${BASE_PATH}/static/lib/swiper/js/swiper.jquery.min.js"></script>
		<script type="text/javascript" src="${BASE_PATH}/static/lib/layer/layer.js"></script>
		<script type="text/javascript" src="${BASE_PATH}/static/lib/template/template.js"></script>
		<script type="text/javascript" src="${BASE_PATH}/static/lib/jquery-lazyload/jquery.lazyload.min.js"></script>
		<script type="text/javascript" src="${BASE_PATH}/static/lib/jquery-marquee/jquery.marquee.min.js"></script>
		<script type="text/javascript" src="${BASE_PATH}/static/app/js/kit.js"></script>
		<script type="text/javascript" src="${BASE_PATH}/static/lib/myAlert/module.js"></script>
		<script type="text/javascript">
		var pageNum = 0,totalPage = 1,loading = false,orderNum,state = '${empty state?0:state}';
			$(function(){
				//绑定“加载中”进入加载事件
				Kit.util.onPageEnd(function(){
	               	if(pageNum < totalPage && !loading){
	               		loading = true;
	               		$("#orderList").append("<div class=\"app-loading\">正在加载</div>");
	               		Kit.ajax.post("${BASE_PATH}/order/page",{pageNum:pageNum+1,pageSize:10,state:'${state}'},function(result){
							$("#orderList").append(template("dataTpl",result.object));
							//amazeui要求在最后一个元素上添加am-u-end样式，否则默认为右浮动
							$(".app-goods-item","#orderList").removeClass("am-u-end").last().addClass("am-u-end");
							//图片延迟加载
							$("img.lazyload","#orderList").not(".lazyload-binded").lazyload({
								failurelimit : 100,
								effect : "show"
							}).addClass("lazyload-binded");
							$(".app-loading","#orderList").remove();
							pageNum = result.object.pageNumber;
							totalPage = result.object.totalPage;
							//没找到数据
							if(totalPage==0) {
								var state="${state}";
								if(state==2){
									$("#orderList").append(template("dataTpls"));
								}else if(state==3){
									$("#orderList").append(template("dataTplz"));
								}
							}
							//重置加载标识
							loading = false;
						});
	               	}
				});
				 
				Kit.ajax.get("${BASE_PATH}/my/state",function(result){
					if(result.flag==0){
						var state = result.object.attrs;
						if(state.noPay > 0){
							$("#noPay .dian").html(state.noPay).show();
						}
						if(state.noTake > 0){
							$("#noTake .dian").html(state.noTake).show();
						}
						/* if(state.noEval > 0){
							$("#noEval .dian").html(state.noEval).show();
						}
						if(state.noDel > 0){
							$("#noDel .dian").html(state.noDel).show();
						} */
					}
				});
			});
			function gopay(orderNum,amount){
					$.ajax({
		                type: "POST",
		                url: "${BASE_PATH}/order/testBuy",
		                data: {"orderNum" : orderNum},
		                dataType: "json",
		                traditional: true,
		                success: function(data){
		               	var goods=data.object;
		               	var buycount=parseInt(goods.buycount);
		   				 var xCount=parseInt(goods.xCount);
		   				 var buytype=parseInt(goods.buytype);
		       			 if(parseInt(goods.pstate)==1 && parseInt(goods.state)==2){    //商品正常并且已上架
		    				 if(buytype==2 && xCount >= buycount ){
		    						 Kit.ui.alert("您已达到限购数量暂无法购买");
		    				 }else{
		    					 if(amount>0){
		    							Kit.render.redirect("${BASE_PATH}/order/prepay/"+orderNum);
		    						}else{
		    							Kit.render.redirect("${BASE_PATH}/order/jfpay/"+orderNum);
		    						}
		    				 }
		       			 }
		              }
		                     
		           });
			}
			function toCancel(orderNum){
				Kit.ui.confirm("确认取消订单",function(){
				Kit.ajax.post("${BASE_PATH}/order/cancle",{orderNum:orderNum},function(result){
					if(result.flag==0){
						Kit.ui.alert("取消成功",function(){
							//重置加载标识
							window.location.reload(true) ;
						});
					}else{
						Kit.ui.alert("取消失败");
						window.location.reload(true) ;
					}
				})
				})
			}
		</script>
		<!-- tpl -->
 	<script type="text/html" id="dataTpl">
			{{each list as order index}}
				<div class=" am-u-md-4 am-u-lg-3 app-goods-item">
					<a href="${BASE_PATH}/goods/shopInfo/{{order.storeid}}">
						<div class="goods_header">
							<img class="header_logo" src="${BASE_PATH}/static/app/img/dianpu.png"/>
							<div class="text_box">
								<span class="hed_ltext">{{order.title}}</span>
								<img class="header_logos" src="${BASE_PATH}/static/app/img/jiantou.png"/>
								{{if order.payState==<%=OrderCode.OrderPayState.NO_PAY%>}}
									<span class="hed_rtext">待支付</span>
								{{else if order.payState==<%=OrderCode.OrderPayState.HAD_PAY%>}}
										{{if order.orderState==<%=OrderCode.OrderState.NO_CON%>}}
											
											{{if order.tuistate==<%=OrderCode.RefundState.ZERO%>}}
												<span class="hed_rtext">未使用</span>
											{{else if order.tuistate==<%=OrderCode.RefundState.VERIFYING%>}}
												<span class="hed_rtext">退款中</span>
											{{else if order.tuistate==<%=OrderCode.RefundState.REFUNDED%>}}
												<span class="hed_rtext">已退款</span>
											{{/if}}
										{{else if order.orderState==<%=OrderCode.OrderState.had_CON%>}}
												<span class="hed_rtext">已兑换</span>
										{{else if order.orderState==<%=OrderCode.OrderState.EXPIRE%>}}
												
												{{if order.tuistate==<%=OrderCode.RefundState.ZERO%>}}
													<span class="hed_rtext">已过期</span>
												{{else if order.tuistate==<%=OrderCode.RefundState.VERIFYING%>}}
													<span class="hed_rtext">退款中</span>
												{{else if order.tuistate==<%=OrderCode.RefundState.REFUNDED%>}}
													<span class="hed_rtext">已退款</span>
												{{/if}}
										{{/if}}
								{{/if}}
							</div>
						</div>
					</a>
					<div class="goods_pic">
						{{if order.amount !=0 && order.payPoint !=0}}
						     <a href="${BASE_PATH}/goods/jfdetail/{{order.goodsid}}?type=3">
                        {{else if order.payPoint !=0}}
                             <a href="${BASE_PATH}/goods/jfdetail/{{order.goodsid}}?type=2">
                        {{else if order.amount !=0 }} 
                              <a href="${BASE_PATH}/goods/jfdetail/{{order.goodsid}}?type=1">
						{{/if}}
							<ul>
								<li><img src="${FTP_PATH}{{order.thumb}}" onerror="src='${BASE_PATH}/static/app/img/model.png';"/></li>
								<span class="pic_textl">{{order.goodsName}}
									 <k style="display:block"> {{order.specTitle}}<k>
                                </span>
								{{if order.amount !=0 && order.payPoint !=0}}
									<span class="pic_textl3">{{order.payPoint/order.countnum}} {{if order.pointType==1}}商品积分{{else if order.pointType==2}}健康积分{{else if order.pointType==3}}教育积分{{/if}} + ¥{{order.amount/order.countnum}}</span>                                
								    <span class="pic_textr">×{{order.countnum}}</span>	
								{{else if order.payPoint !=0}}
									<span class="pic_textl3">{{order.payPoint/order.countnum}} {{if order.pointType==1}}商品积分{{else if order.pointType==2}}健康积分{{else if order.pointType==3}}教育积分{{/if}}</span>
								    <span class="pic_textr">×{{order.countnum}}</span>
								{{else if order.amount !=0 }}                                   
 									<span class="pic_textl3">¥{{order.amount/order.countnum}}</span>
                                    <span class="pic_textr">×{{order.countnum}}</span>
								{{/if}}
	
							</ul>
						</a>
						<span class="goods_rmbs"><a class="goods_rmb_nums">可获得:{{order.sppoint}}商品积分、{{order.jkpoint}}健康积分、{{order.jypoint}}教育积分</a></span>
							{{if order.payPoint ==0}}
								<span class="goods_rmb">共<a class="goods_total_num">{{order.countnum}}</a>件宝贝   合计:<a class="goods_rmb_num">¥{{order.amount}}</a></span>
							{{else if order.amount ==0 }}
								<span class="goods_rmb">共<a class="goods_total_num">{{order.countnum}}</a>件宝贝   合计:<a class="goods_rmb_num">{{order.payPoint}} {{if order.pointType==1}}商品积分{{else if order.pointType==2}}健康积分{{else if order.pointType==3}}教育积分{{/if}} </a></span>
							{{else}}
								<span class="goods_rmb">共<a class="goods_total_num">{{order.countnum}}</a>件宝贝   合计:<a class="goods_rmb_num">¥{{order.amount}} &nbsp;&nbsp;   {{order.payPoint}} {{if order.pointType==1}}商品积分{{else if order.pointType==2}}健康积分{{else if order.pointType==3}}教育积分{{/if}} </a></span>

                            {{/if}}					
                    </div>
					<div class="goods_total">
								{{if order.payState==<%=OrderCode.OrderPayState.NO_PAY%>}}
									<div class="am-fr">
										<a href="javascript:gopay('{{order.orderNum}}',{{order.amount}});"><span class="btn gopingjia">去支付</span></a>
										<a href="javascript:toCancel('{{order.orderNum}}');"><span class="btns">取消订单</span></a>
									</div>
								{{else if order.payState==<%=OrderCode.OrderPayState.HAD_PAY%>}}
										{{if order.orderState==<%=OrderCode.OrderState.NO_CON%>}}
											<div class="am-fr">
												<a href="${BASE_PATH}/order/detail/{{order.orderNum}}"><span class="btn">查看订单</span></a>
											</div>
										{{else if order.orderState==<%=OrderCode.OrderState.had_CON%>}}
												<div class="am-fr">
													<a href="${BASE_PATH}/order/detail/{{order.orderNum}}"><span class="btn">查看订单</span></a>
												</div>
										{{else if order.orderState==<%=OrderCode.OrderState.EXPIRE%>}}
												<div class="am-fr">
													<a href="${BASE_PATH}/order/detail/{{order.orderNum}}"><span class="btn">查看订单</span></a>
												</div>
										{{/if}}
								{{/if}}
					</div>
				</div>
			{{/each}}
		</script>
		<script type="text/html" id="dataTpls">
			<div style="margin-top:7rem;">
				<div>
					<img src="${BASE_PATH}/static/app/img/collectnone.png" style="margin:0 auto;display:block;" width="140">
					<div class="am-text-center app-m-t-10 aaa">暂无待付款订单呢</div>
					<a href="${BASE_PATH}/index" class=" am-center am-radius app-m-t-10 btnn">去逛逛</a>
				</div>
			</div>
		</script>
		<script type="text/html" id="dataTplz">
			<div style="margin-top:7rem;">
				<div>
					<img src="${BASE_PATH}/static/app/img/collectnone.png" style="margin:0 auto;display:block;" width="140">
					<div class="am-text-center app-m-t-10 aaa">太棒啦~ <br/>您的订单已全部兑换</div>
					<a href="${BASE_PATH}/index" class=" am-center am-radius app-m-t-10 btnn">去逛逛</a>
				</div>
			</div>
		</script>
	</body>
</html>
